$(document).ready(function()
{
    loadEvent();
})


function loadEvent(){
     $.getJSON("./events").done(function(events){
        Eventdisplay(events);
     }).fail(function(e){
        console.log(e);
     });
}


function Eventdisplay(events){
        var table = $("<table #eventView class ='event'></table>");
         var tr = $("<tr></tr>");
          tr.append("<td>日期</td>");
          tr.append("<td>记录</td>");
          tr.append("<td>图片</td>");
          tr.append("<td>删除</td>");
          tr.append("<td>修改</td>");
          tr.append("<td>收藏</td>");
         table.append(tr);
         for(var event of events){
              var tr = $("<tr></tr>");
              tr.append("<td>"+event.date+"</td>");
              tr.append("<td>"+event.event+"</td>");
              tr.append("<td>"+"<img src='./image/upload/" + event.picture + "' class = event-pic/>"+"</td>");
              tr.append( "<td><a href='Delete?eventId="+event.id+"'>删除</a></td>" );
              tr.append("<td><a href='UpdateHtml?eventId="+event.id+"'>修改</a></td>");
              tr.append("<td><button onclick = 'Change(this)'><a href='AddToCollection?eventId="+event.id+"'>收藏</a></button></td>");
              table.append(tr);
        }

        var pageCtrl = $("#page-ctrl");
        pageCtrl.append("<a href='subPage'>上一页</a>");
        pageCtrl.append("<a href='addPage'>下一页</a>");

        var Online = $("#onlineNumber");
       fetch('onlineNumber').then((data) => {
                   return data.text()
               }).then((result) => {
                    Online.append("在线人数："+ result+"人");
               })



        $("#eventView").empty().append(table);
}

function Change(button)
{
     $(button).empty().append("已收藏");
 }



